<template>
  <div class="page">
    <div class="weui-cells order">
       <a class="weui-cell" @click="goProDetail(item)" v-for="(item,index) in dataList" :key="index">
        <div class="weui-cell__hd">
          <img class="order_pic" :src="item.picUrl" mode="widthFix">
        </div>
        <div class="weui-cell__bd">
          <div class="order_title">{{item.spName||item.itemName}}</div>
          <div class="order_group">
           <!-- <span class="badge">2人团</span>
            已团2件 -->
          </div>
          <div class="order_price">
            <span class="red">￥{{item.lsdj||item.grpAmount}}</span>
           <!-- 拼团省199.09元 -->
          </div>
        </div>
      </a>
    </div>
    <div class="weui-cells">
      <div class="weui-cell">
        <div class="weui-cell__bd groupinfo">
          <div class="timeend">剩余 <span class="lightred">{{time}}</span> 结束</div>
          <div class="weui-flex group_user">
            <div class="weui-flex__item">
              <div class="group_head">
                <img src="" mode="widthFix">
                <div class="group_leader">团长1</div>
              </div>
            </div>
            <div class="weui-flex__item">
              <div class="group_head">
                <img src="../../../static/images/default.png" mode="widthFix">
              </div>
            </div>
            <div class="weui-flex__item">
              <div class="group_head">
                <img src="../../../static/images/default.png" mode="widthFix">
              </div>
            </div>
          </div>
          <div>还差 <span class="lightred">1</span> 人，叫上小伙伴一起拼</div>
          <div class="share">
            <a href="/pages/share/main" class="weui-flex">
              <img src="../../../static/images/ic_wx.png" mode="widthFix">
              <div class="weui-flex__item">分享给好友</div>
            </a>
            <a href="/pages/share/main" class="weui-flex">
              <img src="../../../static/images/ic_pyq.png" mode="widthFix">
              <div class="weui-flex__item">分享到朋友圈</div>
            </a>
          </div>
        </div>
      </div>
    </div>
    <div class="weui-cells">
      <div class="weui-cell">
        <div class="weui-cell__bd">拼团须知</div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__bd">
          <div class="weui-flex step">
            <div class="weui-flex__item">支付开团 或参团</div>
            <div class="step_line"></div>
            <div class="weui-flex__item lightred">邀请好 友参团</div>
            <div class="step_line"></div>
            <div class="weui-flex__item">成团生成 验证码</div>
            <div class="step_line"></div>
            <div class="weui-flex__item">人不满 将退款</div>
          </div>
        </div>
      </div>
    </div>
    <div class="footer weui-flex">
     <a @click="goHome()" class="weui-flex__item footer_btn footer_btn_default">返回首页</a>
     <a @click="goDetail()" class="weui-flex__item footer_btn footer_btn_primary">立即预约</a>
    </div>
  </div>
</template>

<script>
    import {TimeDown} from "@/utils/util"
export default {
  data () {
    return {
      dataList:[],
      time:"",
      isTuangou:0
    }
  },
  onShow(){
     // setInterval(()=>{
     //    this.time=TimeDown("2019-08-18 15:00:00")
     // },1000)
     this.dataList=[];
      this.isTuangou= wx.getStorageSync('isTuangou')
    this.dataList= JSON.parse(wx.getStorageSync('payShow'))
   console.log(this.dataList)

  },
  methods: {
    goDetail(){
      let url="/pages/bookingstore/main"
        mpvue.navigateTo({ url })
    },
    goHome(){
      let url="/pages/index/main"
        mpvue.switchTab({ url })
    },
  },

  created () {
    // let app = getApp()
  }
}
</script>

<style scoped>
.page{
  padding-bottom: 3.5em;
}
.footer{
  position: fixed;
  bottom: 0px;
  left: 0px;
  z-index: 9999;
  right: 0px;
  padding: 0.8em;
  background: #fff;
  border-top: 1px #eee solid;
}
.footer .footer_btn{
  height: 2.4em;
  border-radius: 1.2em;
  line-height: 2.4em;
  text-align: center;
  margin: 0 0.3em;
}
.footer .footer_btn_default{
  background: #fff;
  border: 1px #eee solid;
  color: #999;
}
.footer .footer_btn_primary{
  background: #FF787E;
  border: 1px #FF787E solid;
  color: #fff;
}
.order .order_pic{
  width: 5em;
  height: 5em;
  margin-right: 0.6em;
  border-radius: 0.3em;
  margin-top: 0.2em;
}
.order .weui-cell:before{
  display: none;
}
.order .weui-cell{
  -webkit-box-align: inherit;
  -webkit-align-items: inherit;
  align-items: inherit;
}
.order_group{
  color: #999;
  font-size: 0.8em
}
.order_group .badge{
  background: #FF787E;
  padding: 0.1em 0.6em;
  border-radius: 0.7em;
  color: #fff;
  margin-right: 0.3em
}
.order_price{
  font-size: 0.8em;
  color: #999;
  padding-top: 0.3em;
}
.order_price span{
  font-size: 1.2em;
  margin-right: 0.3em;
}
.groupinfo{
  text-align: center;
  font-size: 0.8em;
}
.group_user{
  padding: 0.8em 0;
}
.group_head{
  position: relative;
  width: 4em;
  height: 4em;
  margin: 0 auto;
}
.group_head img{
  width: 4em;
  height: 4em;
  border-radius: 2em;
}
.group_head .group_leader{
  background: #FF787E;
  height: 1.4em;
  padding: 0 0.4em;
  border-radius: 0.7em;
  line-height: 1.4em;
  color: #fff;
  font-size: 0.9em;
  position: absolute;
  top: 0px;
  right: -1em;
}
.share{
  padding: 0 2em;
}
.share .weui-flex{
  padding: 0.5em 0;
  width: 50%;
  float: left;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  text-align: left;
}
.share img{
  width: 3em;
  height: 3em;
}
.step{
  line-height: 1.4em;
  padding: 0.4em 0;
}
.step .step_line{
  width: 2em;
  height: 1.4em;
  border-bottom: 1px #eee solid;
}
.step .weui-flex__item{
  font-size: 0.8em;
  text-align: center;
}
</style>
